<!-- subpkg_consult/order_list/components/order-list.vue -->
<script setup>
import { reactive, ref } from 'vue';
import orderlists from './components/orderlists.vue';
	
 // 标签索引值
 const tabIndex = ref(0)
 
 const orderTabs=reactive([
    { label: ' 问医生 ', type: 1, rendered: true },
    { label: ' 极速问诊', type: 2, rendered: false },
    { label: ' 开药问诊 ', type: 3, rendered: false },
  ])
  const  onclick=(data)=>{
	    console.log(data);
		tabIndex.value=data.index
		orderTabs[data.index].rendered=true
  }

  
  

</script>
<template>
  <view class="consult-page" >
    <view class="consult-status-tabs">
      <custom-tabs :list="orderTabs" @click="onclick"></custom-tabs>
    </view>
    
    <!-- 订单列表 -->
    <view v-for="item,index in orderTabs" :key="item.type" v-show="tabIndex==index" >
		<orderlists v-if="item.rendered" :type="item.type" />
	</view>
  </view>
</template>


<style lang="scss">
	// subpkg_consult/order_list/index.scss
	.consult-page {
	  background-color: #f6f6f6;
	}
	
	.consult-status-tabs {
	  padding: 20rpx 30rpx 0;
	  background-color: #fff;
	
	  :deep(.custom-tabs) {
	    justify-content: space-evenly;
	  }
	}
</style>